<template>
	<view class="avatar_container">
		<!-- 照片 -->
		<view class="photo">
			<cutPicture v-model='id' :url="url" />
		</view>
		<view class="true">请上传用户自定义头像</view>
		<!-- 提交按钮 -->
		<button class="btn" @click="editAvatar">修改头像</button>
	</view>
</template>

<script>
	import avatar from "../../components/yq-avatar/yq-avatar.vue";
	import cutPicture from "@/myComponents/cut-picture.vue"
	export default {
		components: {
			cutPicture
		},
		data() {
			return {
				id: null,
				url: null
			}
		},
		onLoad(options) {
			console.log(options)
			this.id = options.id
			if(this.id){
				this.showAvatar(options.id)
			}
			
		},
		methods: {
			showAvatar(id) {
				uni.showLoading()
				this.$http.post('common/file/download', {
					id: id
				}).then(res => {
					uni.hideLoading()
					if (res.code === 10000) {
						// this.tempPath = res.data.fileData
						this.url = res.data.fileData
					}
				})
			},
			editAvatar() {
				uni.showLoading()
				this.$http.post('common/user/updatehead', {
					headurl: this.id
				}).then(res => {
					uni.hideLoading()
					if (res.code === 10000) {
						uni.switchTab({
							url: '../my/my'
						})
						uni.showToast({
							title: '修改成功'
						})
						// uni.showToast({
						// 	title: "头像修改成功",
						// 	icon: 'none'
						// })
						// setTimeout(()=>{
						// 	uni.reLaunch({
						// 		url:'../my/my'
						// 	})
						// }, 500)

					}
				})
			}
		},

	}
</script>

<style lang="scss">
	.avatar_container {
		.photo {
			width: 100%;
			display: flex;
			justify-content: center;
			padding: 40rpx;

		}

		.true {
			display: flex;
			justify-content: center;
			font-size: 24rpx;
			color: #41ADFF;
			margin-bottom: 37rpx;
		}

		.btn {
			width: 536rpx;
			height: 72rpx;
			background: rgba(66, 173, 255, 1);
			border-radius: 36px;
			color: #fff;
			line-height: 72rpx;
			margin-top: 160rpx;
		}
	}
</style>
